<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动情景1：图片与文字环绕</title>
		<style>
			p{
				border: 1px solid red;
				flo at: left;
				font-size: 16px;/*页面文字默认大小：16px*/
				line-height: 20px;/*浮动p块元素，内容行内元素*/
				/*结论：文本不能浮动，特点：块包行*/
			}
			img{
				border: 1px solid red;
				float: right;
			}
		</style>
	</head>
	<body>
		<h1>浮动情景1：图片与文字环绕</h1>
		<img src="img/img1.png" alt="太二真人" width="250px" height="250px">
		<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Inventore, natus id tempore ullam culpa itaque beatae cum numquam modi dolorem voluptatibus at dignissimos dolor necessitatibus ducimus voluptas officiis commodi nobis! Lorem ipsum dolor sit amet consectetur adipisicing elit. Optio voluptatibus officia reprehenderit ipsam itaque aspernatur perspiciatis accusamus tenetur, delectus eaque fugiat provident tempore voluptatem cum omnis. Quidem, dolores odit. Fugiat? Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iure error tempora pariatur quos voluptatem dolor quo similique optio animi saepe illo aut maiores aliquam deleniti, adipisci at autem officia sed. lorem' Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet eaque laborum aut itaque assumenda? Debitis quod ea labore dolor facere eveniet maxime dolorem, accusantium, aspernatur, non asperiores esse eaque corporis. Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusamus ipsa aut quam maxime. Dolore laudantium repellendus in quis autem omnis voluptates quos est porro! Officiis cum repellat quod numquam ducimus!</p>
	</body>
</html>